import React, { forwardRef, useImperativeHandle, useRef } from 'react'

function Input(props, ref) {
  //定义 ref 
  let r = useRef();
  //3. 使用 useImperativeHandle 为父级的 ref 设置方法
  useImperativeHandle(ref, () => {
    //返回一个对象
    return {
      focus: () => {
        //r.current 就是 input 元素
        r.current.focus();
      }
    }
  })
  return (
    <div>
      <input type="text" ref={r} />
    </div>
  )
}

export default forwardRef(Input);